<!doctype html>
<!-- Conditional comment for mobile ie7 http://blogs.msdn.com/b/iemobile/ -->
<!-- Appcache Facts http://appcachefacts.info/ -->
<!--[if IEMobile 7 ]>    <html class="no-js iem7" manifest="../default.appcache?v=1"> <![endif]-->
<!--[if (gt IEMobile 7)|!(IEMobile)]><!--> <html class="no-js" manifest="../default.appcache?v=1"> <!--<![endif]-->

<head>
  <meta charset="utf-8">

  <title></title>
  <meta name="description" content="">
  <meta name="author" content="">

  <!-- Mobile viewport optimization http://goo.gl/b9SaQ -->
  <meta name="HandheldFriendly" content="True">
  <meta name="MobileOptimized" content="320">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <!-- Home screen icon  Mathias Bynens http://goo.gl/6nVq0 -->
  <!-- For iPhone 4 with high-resolution Retina display: -->
  <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../img/h/apple-touch-icon.png">
  <!-- For first-generation iPad: -->
  <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../img/m/apple-touch-icon.png">
  <!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
  <link rel="apple-touch-icon-precomposed" href="../img/l/apple-touch-icon-precomposed.png">
  <!-- For nokia devices: -->
  <link rel="shortcut icon" href="../img/l/apple-touch-icon.png">

  <!--iOS web app, deletable if not needed -->
  <!--<meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <link rel="apple-touch-startup-image" href="img/l/splash.png">-->

  <!-- Mobile IE allows us to activate ClearType technology for smoothing fonts for easy reading -->
  <meta http-equiv="cleartype" content="on">

  <!-- more tags for your 'head' to consider https://gist.github.com/849231 -->

  <!-- Main Stylesheet -->
  <link rel="stylesheet" href="../css/style.css?v=1">

  <!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects -->
  <script src="../js/libs/modernizr-custom.js"></script>
  <!-- Media Queries Polyfill https://github.com/shichuan/mobile-html5-boilerplate/wiki/Media-Queries-Polyfill -->
  <script>Modernizr.mq('(min-width:0)') || document.write("<script src='js/libs/respond.min.js'>\x3C/script>")</script>
  <style>
    button { margin: 0; padding: 0; border: 0; font-weight: normal; font-style: normal; font-size: 100%; line-height: 1; font-family: inherit; text-align: left; }
    div.wrapper { width: 940px; margin: 0 auto; padding: 0 30px 36px; position: relative; }
    div#header { background: #f5f5f5; height: 72px; border-bottom: 1px solid #eee; margin: 0; }
    div#header h4 { float: left; position: absolute; top: 24px; left: 145px; border-left: 1px solid #ddd; padding-left: 14px; }
    div#header h4 small { font-size: 14px; font-weight: normal; }
    div#header h4 a, div#header h4 a:visited { font-weight: normal; }
    div.page-header { padding: 0 0 8px; margin: 18px 0; border-bottom: 1px solid #ddd; }
    div.page-header h1 { padding: 0; margin: 0; font-size: 24px; line-height: 27px; letter-spacing: 0; }
    .awesome, .awesome:visited {
      background: #222 url(/images/alert-overlay.png) repeat-x;
      display: inline-block;
      padding: 5px 10px 6px;
      color: #fff;
      text-decoration: none;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
      -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
      -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
      text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
      border-bottom: 1px solid rgba(0,0,0,0.25);
      position: relative;
      cursor: pointer;
    }

    .awesome:hover  { background-color: #111; color: #fff; }
    .awesome:active  { top: 1px; }
    .small.awesome, .small.awesome:visited          { font-size: 11px; padding: ; }
    .awesome, .awesome:visited,
    .medium.awesome, .medium.awesome:visited        { font-size: 13px; font-weight: bold; line-height: 1; text-shadow: 0 -1px 1px rgba(0,0,0,0.25); }
    .large.awesome, .large.awesome:visited          { font-size: 14px; padding: 8px 14px 9px; }

    .green.awesome, .green.awesome:visited      { background-color: #91bd09; }
    .green.awesome:hover                        { background-color: #749a02; }
    .blue.awesome, .blue.awesome:visited        { background-color: #2daebf; }
    .blue.awesome:hover                         { background-color: #007d9a; }
    .red.awesome, .red.awesome:visited          { background-color: #e33100; }
    .red.awesome:hover                          { background-color: #872300; }
    .magenta.awesome, .magenta.awesome:visited      { background-color: #a9014b; }
    .magenta.awesome:hover                          { background-color: #630030; }
    .orange.awesome, .orange.awesome:visited        { background-color: #ff5c00; }
    .orange.awesome:hover                           { background-color: #d45500; }
    .yellow.awesome, .yellow.awesome:visited        { background-color: #ffb515; }
    .yellow.awesome:hover                           { background-color: #fc9200; }
    #contactus {width:220px; height:40px;}
  </style>
</head>

<body>

  <div id="container">
    <header>

    </header>
    <div id="main" role="main">

      <button id="btn" class="large awesome magenta">Show form!</button><br>

      <div id="contactus">
          <p>Type a message to see it autogrow:</p>
          <textarea id="contact"></textarea>
      </div>

    </div>

    <footer>

    </footer>
  </div> <!--! end of #container -->

  <!-- JavaScript at the bottom for fast page loading -->

  <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  <script>window.jQuery || document.write("<script src='js/libs/jquery-1.6.2.min.js'>\x3C/script>")</script>

  <!-- scripts concatenated and minified via ant build script -->
  <script src="../js/mylibs/helper.js"></script>
  <script>
    function showForm() {
        $("#contactus").show();
    }

    $("#contactus").hide();

    var btn = document.getElementById("btn");
    new MBP.fastButton(btn,showForm);

    var contact = document.getElementById("contact");
    MBP.autogrow(contact);

  </script>
  <!-- end concatenated and minified scripts-->

  <script>
    // iPhone Scale Bug Fix, read this when using http://www.blog.highub.com/mobile-2/a-fix-for-iphone-viewport-scale-bug/
    MBP.scaleFix();
  </script>

  <!-- Debugger - remove for production -->
  <!-- <script src="https://getfirebug.com/firebug-lite.js"></script> -->

</body>
</html>
